<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        /*
            在CSS中祖先元素上的样式，也会被他的后代元素所继承
            利用继承，可以将一些基本的样式设置给祖先元素，这样所有的后代元素将会自动继承这些样式
            但是并不是所有的样式都会被子元素所继承，比如说：背景颜色和所有和背景相关的样式都不会被继承
            边框啊定位啊，这些也不会被继承

            背景颜色默认是透明的，这里之所以看到后代元素的背景颜色也改变了，就是因为祖先元素的背景颜色透过来的
        */
        p{
            font-size: 30px;
            background-color: yellow;
        }
    </style>
</head>
<body>
    <p>
        我是p标签中的文字<br />
        <span>我是span中的文字</span>
    </p>
    <span>我是p标签外边的span</span>
</body>
</html>